<template>
    <!-- <div>封堵白名单</div> -->
    <a-row>
      <a-col>
        <a-card :bordered="false" style="margin-bottom: 10px">
          <!-- 查询区域 -->
          
          <div class="table-page-search-wrapper">
            <a-form-model ref="ruleForm" :model="pageFilter" :label-col="labelCol" :wrapper-col="wrapperCol">
              <a-row style="display:flex">
                <a-col :span="6">
                <a-form-model-item label="批次类型">
                    <a-input placeholder="请输入任务名称" />
                </a-form-model-item>
              </a-col>
                <a-col :span="6">
                <a-form-model-item label="批次号" style="margin-left:0px">
                    <a-input placeholder="请输入任务名称" />
                </a-form-model-item>
                </a-col>
                <a-col :span="6">
                <a-form-model-item label="封堵范围" style="margin-left:0px">
                    <a-range-picker allowClear style="width:100%;" format="YYYY-MM-DD"
                    valueFormat="YYYY-MM-DD HH:MM:SS" v-model="pageFilter.time"/>
                </a-form-model-item>
              </a-col>  
              </a-row>
              
            </a-form-model>
          </div>
        </a-card>
        <a-card :bordered="false">
          <div>
            <a-button type="primary" @click="chouqu" style="margin-right:10px" v-if="type != 'details'">抽取</a-button>
            
            <z-table ref="table" rowKey="id" :showAlert="false" :showSelection="true" :loading="loading"
              :columns="columns" :dataSource="pageData" @selectedRowKey="onSelectedRow" @change="onTableChange">
             
            </z-table>
          </div>
          <div style="margin-left:40%;margin-bottom: 10%;margin-top: 50px;">
                <a-button style="margin-right:30px" type="primary" @click="save" v-if="type != 'details'">保存</a-button>
                <a-button @click="push" v-if="type != 'details'">推送</a-button>
        </div>
        </a-card>
      </a-col>
    </a-row>
  </template>
  
  <script>
  import { extractionBlockingHandPush,addBlockingHandPush,modifyBlockingHandPush,
           findByIdBlockingHandPush } from '@/api/plugging/Police'
  export default {
    mounted () {
      this.type = this.$route.query.type
      if(this.type == 'details'){
          this.batchNumber = this.$route.query.batchNumber
          this.refreshTable()
      }
    },
    data () {
      return {
        batchNumber:'',
        type:'',
        show:false,
        labelCol: { span: 5 },
        wrapperCol: { span: 16 },
        loading: false,
        pageFilter: {
          pageNo: 1,
          pageSize: 10,
        },
        pageData: {
            
        },
        columns:[
          {
            title: '序号',
            dataIndex: 'order',
            width: 60,
            align: 'center',
            customRender: (text, record, index) =>
              `${(this.pageFilter.pageNo - 1) * this.pageFilter.pageSize + (index + 1)}` //序号分页后连续
          },
          {
            title: '封堵地址',
            dataIndex: 'fraudUrl',
            align: 'center',
            width:120
          },
          {
            title: '数据来源',
            dataIndex: 'dataSource',
            align: 'center',
            width:120,
            customRender:text=>`${text==1?'kafka数据信息':text==2?'SFTP文件':'涉诈网址上报'}`
          },
          {
            title: '发现时间',
            dataIndex: 'discoveryTime',
            align: 'center',
            width:120
          },
          {
            title: '管局接收状态',
            dataIndex: 'receivedStatus',
            align: 'center',
            width:120,
            customRender:text=>`${text==0?'未接收':text==1?'接收成功':'接收失败'}`
          },
          {
            title: '管局接收时间',
            dataIndex: 'receivedTime',
            align: 'center',
            width:120
          },
          {
            title: '移动封堵状态',
            dataIndex: 'mobileBlockingStatus',
            align: 'center',
            width:120,
            customRender:text=>`${text==0?'未接收':text==1?'待封堵':'封堵成功'}`
          },
          {
            title: '移动封堵时间',
            dataIndex: 'mobileBlockingTime',
            align: 'center',
            width:120
          },
          {
            title: '联通封堵状态',
            dataIndex: 'unicomBlockingStatus',
            align: 'center',
            width:120,
            customRender:text=>`${text==0?'未接收':text==1?'待封堵':'封堵成功'}`
          },
          {
            title: '联通封堵时间',
            dataIndex: 'unicomBlockingTime',
            align: 'center',
            width:120
          },
          {
            title: '电信封堵状态',
            dataIndex: 'telecomBlockingStatus',
            align: 'center',
            width:120,
            customRender:text=>`${text==0?'未接收':text==1?'待封堵':'封堵成功'}`
          },
          {
            title: '电信封堵时间',
            dataIndex: 'telecomBlockingTime',
            align: 'center',
            width:120
          },
          {
            title: '批次号',
            dataIndex: 'batchNo',
            align: 'center',
            width:120
          },

        ]
      }
    },
    methods: {
      push(){
        let obj = {
          listBlockingQuickReportDto:this.pageData
        }
        modifyBlockingHandPush(obj).then( res => {
          if (res.success) {
            this.$message.success(res.message)
            this.loading = false
          } else {
            this.$message.success(res.message)
            this.loading = false
          }
        })
          .catch((e) => {
            this.loading = false
            this.$message.warn('请求失败！')
          })
      },
      save(){
        let obj = {
          listBlockingQuickReportDto:this.pageData
        }
        addBlockingHandPush(obj).then( res => {
          if (res.success) {
            this.$message.success(res.message)
            this.loading = false
          } else {
            this.$message.success(res.message)
            this.loading = false
          }
        })
          .catch((e) => {
            this.loading = false
            this.$message.warn('请求失败！')
          })
      },
      chouqu(){
        let obj = {
          startDiscoveryTime:this.pageFilter.time[0],
          endDiscoveryTime:this.pageFilter.time[1],
          pageNo:1,
          pageSize:10
        }
        extractionBlockingHandPush(obj).then( res => {
          if (res.success) {
            // res.result = res.result.listBlockingQuickReportDto
            this.pageData = res.result ? res.result : {}
            this.loading = false
          } else {
            this.$message.success(res.message)
            this.loading = false
          }
        })
          .catch((e) => {
            this.loading = false
            this.$message.warn('请求失败！')
          })
      },
      onQuery() {
        this.pageFilter.pageNo = 1
        this.refreshTable()
        console.log(this.pageData);
      },
      //重置
      onResetForm() {
        this.pageFilter = {
          pageNo: 1,
          pageSize: 10,
          departmentId: this.departmentId
        }
        this.refreshTable()
      },
      onSelectedRow(keys) {
        this.selectKeys = keys
        this.isDisabled = keys.length > 0 ? false : true
      },
      onTableChange(pagination, pageFilter, sorter) {
        let keyMap = { currentPage: 'pageNo' }
        let paginations = Object.keys(pagination).reduce((newData, key) => {
          let newKey = keyMap[key] || key
          newData[newKey] = pagination[key]
          return newData
        }, {})
        this.pageFilter = Object.assign({}, this.pageFilter, paginations)
        this.refreshTable()
      },
      refreshTable() {
        this.loading = true
        findByIdBlockingHandPush(this.batchNumber).then( res => {
          if (res.success) {
            this.pageData = res.result ? res.result : {}
            this.loading = false
          } else {
            this.$message.success(res.message)
            this.loading = false
          }
        })
          .catch((e) => {
            this.loading = false
            this.$message.warn('请求失败！')
          })
      },
    }
  }
  </script>
  
  <style lang="less" scoped>
  .search-wrapper-btn {
    position: absolute;
    right: 8%;
    top: 22px;
    z-index: 100;
  }
  </style>